/* margin、padding、fontSize中的值 */
@marAndPadAndFontList: 0, 2, 4, 5, 6, 8, 10, 12, 14, 15, 16, 18, 20, 22, 24, 26, 28, 30, 32, 36, 40, 48, 60, 72, 108;

@len: length(@marAndPadAndFontList);

.loopDomP(@i) when (@i <=@len) {
    /* 获取内容 */
    @key: extract(@marAndPadAndFontList, @i);
    @value: ~'@{key}px';

    /* margin外边距 */
    .mt-@{key} {
        margin-top: @value !important;
    }

    .mr-@{key} {
        margin-right: @value !important;
    }

    .mb-@{key} {
        margin-bottom: @value !important;
    }

    .ml-@{key} {
        margin-left: @value !important;
    }

    .mg-@{key} {
        margin: @value !important;
    }

    /* padding内边距 */
    .pt-@{key} {
        padding-top: @value !important;
    }

    .pr-@{key} {
        padding-right: @value !important;
    }

    .pb-@{key} {
        padding-bottom: @value !important;
    }

    .pl-@{key} {
        padding-left: @value !important;
    }

    .pg-@{key} {
        padding: @value !important;
    }

    /* font-size字号 */
    .fs-@{key} {
        font-size: @value !important;
    }

    /* 循环调用 */
    .loopDomP(@i+1) !important;
}

/* 调用函数 */
.loopDomP(1) !important;

/* 元素的总大小 */
.box-border {
    box-sizing: border-box !important;
}

.box-content {
    box-sizing: content-box !important;
}

/* 元素显示类型 */
.block {
    display: block !important;
}

.inline-block {
    display: inline-block !important;
}

.inline {
    display: inline !important;
}

.flex {
    display: flex !important;
}

.inline-flex {
    display: inline-flex !important;
}

.table {
    display: table !important;
}

.inline-table {
    display: inline-table !important;
}

.table-caption {
    display: table-caption !important;
}

.table-cell {
    display: table-cell !important;
}

.table-column {
    display: table-column !important;
}

.table-column-group {
    display: table-column-group !important;
}

.table-footer-group {
    display: table-footer-group !important;
}

.table-header-group {
    display: table-header-group !important;
}

.table-row-group {
    display: table-row-group !important;
}

.table-row {
    display: table-row !important;
}

.flow-root {
    display: flow-root !important;
}

.grid {
    display: grid !important;
}

.inline-grid {
    display: inline-grid !important;
}

.contents {
    display: contents !important;
}

.list-item {
    display: list-item !important;
}

.hidden {
    display: none !important;
}

/* 浮动 */
.float-right {
    float: right !important;
}

.float-left {
    float: left !important;
}

.float-none {
    float: none !important;
}

/* 清除浮动 */
.clear-left {
    clear: left !important;
}

.clear-right {
    clear: right !important;
}

.clear-both {
    clear: both !important;
}

.clear-none {
    clear: none !important;
}

/* 定位 */
.static {
    position: static !important;
}

.fixed {
    position: fixed !important;
}

.absolute {
    position: absolute !important;
}

.relative {
    position: relative !important;
}

.sticky {
    position: sticky !important;
}

/* 滚动条 */
.overflow-auto {
    overflow: auto !important;
}

.overflow-hidden {
    overflow: hidden !important;
}

.overflow-visible {
    overflow: visible !important;
}

.overflow-scroll {
    overflow: scroll !important;
}

.overflow-x-auto {
    overflow-x: auto !important;
}

.overflow-y-auto {
    overflow-y: auto !important;
}

.overflow-x-hidden {
    overflow-x: hidden !important;
}

.overflow-y-hidden {
    overflow-y: hidden !important;
}

.overflow-x-visible {
    overflow-x: visible !important;
}

.overflow-y-visible {
    overflow-y: visible !important;
}

.overflow-x-scroll {
    overflow-x: scroll !important;
}

.overflow-y-scroll {
    overflow-y: scroll !important;
}

/* 可见性 */
.visible {
    visibility: visible !important;
}

.invisible {
    visibility: hidden !important;
}

/* Align Items */
.items-start {
    align-items: flex-start !important;
}

.items-end {
    align-items: flex-end !important;
}

.items-center {
    align-items: center !important;
}

.items-baseline {
    align-items: baseline !important;
}

.items-stretch {
    align-items: stretch !important;
}

/* Justify Content */
.justify-start {
    justify-content: flex-start !important;
}

.justify-end {
    justify-content: flex-end !important;
}

.justify-center {
    justify-content: center !important;
}

.justify-between {
    justify-content: space-between !important;
}

.justify-around {
    justify-content: space-around !important;
}

.justify-evenly {
    justify-content: space-evenly !important;
}

/* 文本对齐 */
.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

/* 文本垂直对齐 */
.align-baseline {
    vertical-align: baseline !important;
}

.align-top {
    vertical-align: top !important;
}

.align-middle {
    vertical-align: middle !important;
}

.align-bottom {
    vertical-align: bottom !important;
}

.align-text-top {
    vertical-align: text-top !important;
}

.align-text-bottom {
    vertical-align: text-bottom !important;
}

/* 文本换行 */
.break-normal {
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.break-words {
    overflow-wrap: break-word !important;
}

.break-all {
    word-break: break-all !important;
}

/* 文本转换 */
.uppercase {
    text-transform: uppercase !important;
}

.lowercase {
    text-transform: lowercase !important;
}

.capitalize {
    text-transform: capitalize !important;
}

.normal-case {
    text-transform: none !important;
}

/* 文本溢出 */
.truncate {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.overflow-ellipsis {
    text-overflow: ellipsis !important;
}

.overflow-clip {
    text-overflow: clip !important;
}

/* 文本粗细 */
.font-light {
    font-weight: 300 !important;
}

.font-normal {
    font-weight: 500 !important;
}

.font-bold {
    font-weight: 700 !important;
}

/* 背景图像固定 */
.bg-fixed {
    background-attachment: fixed !important;
}

.bg-local {
    background-attachment: local !important;
}

.bg-scroll {
    background-attachment: scroll !important;
}

/* 背景图像裁剪 */
.bg-clip-border {
    background-clip: border-box !important;
}

.bg-clip-padding {
    background-clip: padding-box !important;
}

.bg-clip-content {
    background-clip: content-box !important;
}

.bg-clip-text {
    background-clip: text !important;
}

/* 背景图像位置 */
.bg-bottom {
    background-position: bottom !important;
}

.bg-center {
    background-position: center !important;
}

.bg-left {
    background-position: left !important;
}

.bg-left-bottom {
    background-position: left bottom !important;
}

.bg-left-top {
    background-position: left top !important;
}

.bg-right {
    background-position: right !important;
}

.bg-right-bottom {
    background-position: right bottom !important;
}

.bg-right-top {
    background-position: right top !important;
}

.bg-top {
    background-position: top !important;
}

/* 背景图像重复 */
.bg-repeat {
    background-repeat: repeat !important;
}

.bg-no-repeat {
    background-repeat: no-repeat !important;
}

.bg-repeat-x {
    background-repeat: repeat-x !important;
}

.bg-repeat-y {
    background-repeat: repeat-y !important;
}

.bg-repeat-round {
    background-repeat: round !important;
}

.bg-repeat-space {
    background-repeat: space !important;
}

/* 背景图像大小 */
.bg-auto {
    background-size: auto !important;
}

.bg-cover {
    background-size: cover !important;
}

.bg-contain {
    background-size: contain !important;
}

/* 边框圆角 */
.rounded-none {
    border-radius: 0px !important;
}

.rounded-4 {
    border-radius: 4px !important;
}

.rounded-6 {
    border-radius: 6px !important;
}

.border-red {
    border: 1px solid red !important;
}

/* 边框样式 */
.border-solid {
    border-style: solid !important;
}

.border-dashed {
    border-style: dashed !important;
}

.border-dotted {
    border-style: dotted !important;
}

.border-double {
    border-style: double !important;
}

.border-none {
    border-style: none !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.height-all {
    height: 100% !important;
}

.color-B58704 {
    color: #b58704;
}
.bg-color-B58704 {
    background-color: #b58704;
}
.color-065323 {
    color: #065323;
}
.bg-color-065323 {
    background-color: #065323;
}
.color-4c785c {
    color: #4c785c;
}
.bg-color-4c785c {
    background-color: #4c785c;
}
.color-69B486 {
    color: #69b486;
}
.bg-color-69B486 {
    background-color: #69b486;
}
.color-3191FF {
    color: #3191ff;
}
.bg-color-3191FF {
    background-color: #3191ff;
}
.color-3191FF {
    color: #3191ff;
}
.bg-color-3191FF {
    background-color: #3191ff;
}
